import { ElIcon, ElImage, ElProgress, ElMessage } from 'element-plus'
import { Picture as IconPicture } from '@element-plus/icons-vue'
import { useRouter } from 'vue-router'
import { ref } from 'vue'
import { businessSubAudit } from '@/api/salesleads/salesmanagement/business'
const router = useRouter()

const onAssistInfo = (row: any) => {
  let str = ''
  row.forEach((item: any) => {
    str += `${item}，`
  })
  // 去除最后一个逗号
  str = str.substring(0, str.length - 1)
  return str
}
export const stageState = ref(0) // 0全部 1待审核 2已审核
export const useSubmitContent: { submit: Function } = { submit: () => {} }

export const tableOption = [
  {
    type: 'selection',
    width: 55,
    fixed: 'left',
    reserveSelection: true
  },
  {
    prop: 'business_code',
    label: '商机编号',
    width: 270
  },
  {
    prop: 'business_code',
    label: '商机名称',
    width: 250,
    render({ row, column, index }: any) {
      const stateColor = {
        1: '#5AB8F9',
        2: '#59D2A0',
        3: '#FF5A58'
      }
      return (
        <>
          <div>{row.name}</div>
          <ElProgress percentage={row.win_rate} color={stateColor[row.state]} />
        </>
      )
    }
  },
  {
    prop: 'stage_name',
    label: '商机阶段',
    width: 200,
    render({ row, column, index }: any) {
      return row.stage_name || '--'
    }
  },
  {
    prop: 'cust_info',
    label: '客户信息',
    width: 200,
    render({ row, column, index }: any) {
      return (
        <>
          <div>{row.cust_info.name}</div>
          <div>{row.cust_info.mobile || '--'}</div>
        </>
      )
    }
  },
  {
    prop: 'amount',
    label: '商机金额',
    width: 150,
    render({ row, column, index }: any) {
      return `￥${row.amount}` || '--'
    }
  },
  {
    prop: 'predict_time',
    label: '预计赢单时间',
    width: 200
  },
  {
    prop: 'belong_dept_name',
    label: '归属员工-部门',
    width: 300,
    render({ row, column, index }: any) {
      return `${row.belong_info.name}-${row.belong_dept_name}`
    }
  },
  {
    prop: 'assist_info',
    label: '协助员工',
    width: 220,
    render({ row, column, index }: any) {
      if (!row.assist_info.length) {
        return <div>--</div>
      } else if (onAssistInfo(row.assist_info).length < 13) {
        return onAssistInfo(row.assist_info)
      } else {
        return (
          <el-popover placement="top-start" width={200} trigger="hover">
            {{
              default: () => onAssistInfo(row.assist_info),
              reference: () => <div class="assist_info">{onAssistInfo(row.assist_info)}</div>
            }}
          </el-popover>
        )
      }
    }
  },
  {
    prop: 'created_name',
    label: '创建人',
  },
  {
    prop: 'created_at',
    label: '创建时间',
    width: 170
  },
  {
    prop: 'audit_created_name',
    label: '提审人',
  },
  {
    prop: 'audit_at',
    label: '提审时间',
    width: 180,
    render({ row, column, index }: any) {
      return row.audit_at || '--'
    }
  },
  {
    prop: 'audit_stage_name',
    label: '最近一次审核阶段',
    width: 200
  },
  {
    prop: 'audit_name',
    label: '审核员工',
  },
  {
    prop: 'audit_at',
    label: '最近一次审核时间',
    width: 170
  },
  {
    prop: 'operate',
    label: '操作',
    minWidth: 200,
    fixed: 'right',
    isOperate: true,
    option: [
      {
        name: '查看',
        click(row: any) {
          useSubmitContent.submit('LOOK', row)
        },
        isRender: () => stageState.value === 0
      },
      {
        name: '编辑',
        click: (row: any) => {
          useSubmitContent.submit('EDIT', row)
        },
        isRender: ({ row }: any) => stageState.value === 0 && row.state == 1 && row.operate_prem == 1
      },
      {
        name: '添加跟进',
        click: (row: any) => {
          useSubmitContent.submit('ADD_FOLLOW', row)
        },
        isRender: ({ row }: any) => stageState.value === 0 && row.state == 1 && row.operate_prem == 1
      },
      {
        name: '输单',
        click: (row: any) => {
          useSubmitContent.submit('LOSE', row)
        },
        isRender: ({ row }: any) => stageState.value === 0 && row.state == 1 && row.operate_prem == 1
      },
      {
        name: '审核通过',
        click: (row: any) => {
          useSubmitContent.submit('THROUGH', row)
        },
        isRender: ({ row }: any) => stageState.value === 1 && row.audit_prem == 1
      },
      {
        name: '审核不通过',
        click: (row: any) => {
          useSubmitContent.submit('NO_THROUGH', row)
        },
        isRender: ({ row }: any) => stageState.value === 1 && row.audit_prem == 1
      },
      {
        name: '重新提审',
        click: (row: any) => {
          businessSubAudit({ business_id: row.business_id }).then((res: any) => {
            useSubmitContent.submit('RELOADTABLE', row)
            ElMessage.success('重新提交审核成功')
          })
        },
        isRender: ({ row }: any) => stageState.value === 2 && row.stage_state == 3
      },
      {
        name: '详情',
        click: (row: any) => {
          useSubmitContent.submit('DETAIL', row)
        }
      }
    ]
  }
]
